<template>
  <view class="shop_paper">
    <div class="top">
      <div class="new">
        <div class="newl">
          物流信息
        </div>
        <div class="newr">
          修改
        </div>
      </div>
      <div class="wz">
        收货地址：曹某某，1377777777，上海市东区上海市东区
      </div>
    </div>
    <div class="shop">
      <div class="top1">
        商品信息
      </div>
      <div class="center">
        <image class="img" src="../../static/design/default.png" mode=""></image>
        <div class="center_wz">
          设计方案套餐设计方案套餐设计方案套餐
        </div>
        <div class="money">
          ￥499.00
        </div>
        <div class="bottom">
          <span>直接购买    库存充足</span><span>X2</span>
        </div>
      </div>
      <div class="center">
        <image class="img" src="../../static/design/default.png" mode=""></image>
        <div class="center_wz">
          设计方案套餐设计方案套餐设计方案套餐
        </div>
        <div class="money">
          ￥499.00
        </div>
        <div class="bottom">
          <span>直接购买    未必有货</span><span>X2</span>
        </div>
      </div>
      <div class="tip">
        易损商品，建议购买保险提示
      </div>
      <div class="top2">
        <span>商品总价：</span> <span>￥499.00</span>
      </div>
      <div class="top2">
        <span>可选服务：</span> <span>¥4.00 退换服务保险服务></span>
      </div>
      <div class="top2">
        <span>运费：</span> <span>￥499.00</span>
      </div>
      <div class="top2">
        <span>设计费：</span> <span>￥49.00</span>
      </div>
      <div class="top2">
        <span>需付款：</span> <span>¥4449.00</span>
      </div>
      <div class="top2">
        <span>订单编号：</span> <span>4444444444</span>
      </div>
      <div class="top2">
        <span>创建时间：</span> <span>2023年3月9日22:07:57</span>
      </div>
      </div>
      <div class="last">
        <div class="newrl">
          继续付款
        </div>
        <div class="newrr">
          取消订单
        </div>
      </div>
  </view>
</template>

<script>
</script>

<style>
  .top{
   width: 100%;
   padding: 20rpx 30rpx;
   box-sizing: border-box;
   background-color: #fff;
   margin-top: 5rpx;
  }
  .new{
    width: 100%;
    height: 60rpx;
    display: flex;
    justify-content: space-between;
  }
  .newl{
    color: #333333;
   font-size: 35rpx;
   font-weight: 600;
  }
  .newr{
    width: 180rpx;
    height: 55rpx;
    background-color: #333333;
    color: #fff;
    line-height: 55rpx;
    text-align: center;
    border-radius: 25rpx;
    font-size: 25rpx;
  }
  .wz{
    width: 600rpx;
    height: 70rpx;
    color: #7F7F7F;
    font-size: 20rpx;
    margin: 25rpx 0rpx 45rpx 0rpx;
    line-height: 40rpx;
  }
  .shop {
    width: 100%;
    height: 1000rpx;
    padding: 20rpx 30rpx;
    box-sizing: border-box;
    background-color: #fff;
    margin-top: 5rpx;
  }
  .center {
    width: 100%;
    height: 150rpx;
    display: flex;
    justify-content: space-between;
    margin-top: 33rpx;
    position: relative;
  }
  .center_wz {
    width: 330rpx;
    height: 45rpx;
    float: left;
    font-size: 30rpx;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .money {
    font-size: 30rpx;
    color: red;
    font-weight: 600;
  }
  .img {
    width: 200rpx;
    height: 150rpx;
    border-radius: 25rpx 25rpx 0 0;
    float: left;
  }
  .bottom {
    height: 30rpx;
    width: 450rpx;
    position: absolute;
    bottom: 0;
    right: 15rpx;
    display: flex;
    justify-content: space-between;
    font-size: 20rpx;
    color: #7F7F7F;
  }
  .tip{
    width: 400rpx;
    height: 40rpx;
    font-size: 25rpx;
    color: #333333;
    margin-top: 25rpx;
    margin-right: 0;
    margin-left: 220rpx;
  }
  .top2 {
    width: 100%;
    height: 30rpx;
    margin-top: 25rpx;
    font-size: 20rpx;
    color: #7F7F7F;
    display: flex;
    justify-content: space-between;
    margin: 30rpx 0 30rpx 0;
  }
  .top2 span:nth-child(1) {
    display: block;
    width: 140rpx;
    text-align: right;
  }
  .last{
    width: 100%;
    height: 140rpx;
    background-color: #fff;
     margin-top: 80rpx; 
    padding: 20rpx 30rpx;
    box-sizing: border-box;
  }
  .newrl{
    width: 200rpx;
    height: 70rpx;
    background-color: #333333;
    color: #fff;
    line-height: 70rpx;
    text-align: center;
    border-radius: 70rpx;
    font-size: 25rpx;
    float: right;
    margin-left: 15rpx;
  }
  .newrr{
    width: 200rpx;
    height: 70rpx;
    background-color: #333333;
    color: #fff;
    line-height: 70rpx;
    text-align: center;
    border-radius: 70rpx;
    font-size: 25rpx;
    float: right;
  }
  
</style>